<template>
	<div class="sw_system_container">
		<div class="sw_query_form" v-if="$isHasAuth(['cca331962efb4049b2dce3f29501c63d'])">
			<el-form size="small" inline>
				<el-form-item>
					<el-input v-model="queryData.subject" clearable placeholder="邮件主题" style="width: 180px"></el-input>
				</el-form-item>
				<el-form-item>
					<el-input v-model="queryData.recevieUser" clearable placeholder="邮件接收人" style="width: 180px"></el-input>
				</el-form-item>
				<el-form-item>
					<el-select v-model="queryData.operType" clearable placeholder="发送类型" style="width: 100px">
						<el-option label="自动" value="1"></el-option>
						<el-option label="手动" value="2"></el-option>
					</el-select>
				</el-form-item>
				<el-form-item>
					<el-date-picker v-model="queryData.createTime" type="date" value-format="yyyy-MM-dd" placeholder="邮件发送日期" style="width: 160px"></el-date-picker>
				</el-form-item>
				<el-form-item>
					<el-button type="primary" icon="el-icon-search" @click="queryTableData">查询</el-button>
				</el-form-item>
			</el-form>
		</div>
		<div class="sw_table_container">
			<el-table ref="table" size="medium" :data="tableData" stripe height="100%" class="index_table_wrapper">
				<el-table-column type="index" width="48" align="center"></el-table-column>
				<el-table-column prop="recevieUser" label="接收人" width="240"></el-table-column>
				<el-table-column prop="subject" label="主题">
					<template slot-scope="{ row }">
						<span class="link" v-if="!$isHasAuth(['707213fba3a242f4ae0f6147bac75fca'])">{{ row.subject }}</span>
						<router-link class="link" v-else :to="`/mailManage/records/${row.id}`">{{ row.subject }}</router-link>
					</template>
				</el-table-column>
				<el-table-column prop="createTime" label="时间" width="180"></el-table-column>
			</el-table>
		</div>
		<template v-if="dataCount > 0">
			<sw-pagination :total="dataCount" :page.sync="queryData.page" :limit.sync="queryData.limit" @change="queryTableData"></sw-pagination>
		</template>
		<form-dialog v-model="formDialog"></form-dialog>
	</div>
</template>

<script>
import formDialog from './form';
import { queryMailPageList } from '@/api/business/tbMailMessage';
export default {
	components: { formDialog },
	data() {
		return {
			loading: false,
			dataCount: 0,
			queryData: { page: 1, limit: 15 },
			tableData: [],
			formDialog: false,
			checkedData: []
		};
	},
	computed: {
		topFrames() {
			return ['cca331962efb4049b2dce3f29501c63d'];
		}
	},
	mounted() {
		this.queryTableData();
	},
	methods: {
		//获取邮件列表
		async getTableData() {
			let params = { ...this.queryData };
			let result = await queryMailPageList(params).then((res) => res.data);
			this.loading = false;
			if (result.code === '0') {
				this.dataCount = parseInt(result.count);
				this.tableData = result.data || [];
			}
		},

		//查询数据
		queryTableData() {
			this.loading = true;
			this.getTableData();
		},

		handleOpenDialog() {
			this.formDialog = true;
		}
	}
};
</script>

<style lang="scss" scoped>
.mail_message_container {
}
</style>
